import React, { Component } from 'react'
import { Table, Space } from 'antd';

class Student extends Component {
    constructor(props) {
        super(props)
        this.state = {
            columns: [
                {
                    title: '姓名',
                    dataIndex: 'name',
                    key: 'name',
                    render: text => <a>{text}</a>,
                },
                {
                    title: '年龄',
                    dataIndex: 'age',
                    key: 'age',
                    render: text => <a>{text}</a>,
                },{
                    title: '爱好',
                    dataIndex: 'hobby',
                    key: 'hobby',
                    render: text => <a>{text}</a>,
                },
                {
                    title: '操作',
                    key: 'action',
                    render: (record) => (
                        <Space size="middle">
                            <a onClick={this.click.bind(this, record)}>删除</a>
                        </Space>
                    ),
                },
            ],
            data: [
                {
                    name: "哒哒哒",
                    age: 18,
                    hobby: "篮球",
                    key: "1"
                },
                {
                    name: "嘿嘿嘿",
                    age: 18,
                    hobby: "跑步",
                    key: "2"
                },
                {
                    name: "小猪",
                    age: 18,
                    hobby: "吃肉肉",
                    key: "3"
                },
                {
                    name: "燕儿",
                    age: 18,
                    hobby: "所有好吃的",
                    key: "4"
                },
                {
                    name: "大姐",
                    age: 18,
                    hobby: "写题",
                    key: "5"
                },
                {
                    name: "宝宝",
                    age: 18,
                    hobby: "打游戏",
                    key: "6"
                }
            ]
        }
    }
    click = (record) => {
        console.log(record)
        var temp = this.state.data
        this.state.data.map((ele, index) => {
            if (ele.key === record.key) {
                temp.splice(index, 1)
            }
        })
        this.setState({
            data: [...temp]
        })
    }
    render() {
        return (
            <div className='Student'>
                <Table columns={this.state.columns} dataSource={this.state.data}
                    pagination={{ pageSize: 8 }} />
            </div>
        );
    }
}
export default Student;